<!-- 设备管理-基础设置页面 -->
<template>
  <div style="background: white">
    <px-tabs v-if="addTag" v-model="activeName" class="equipment-tabs">
      <px-tab-pane name="first">
        <template #label>
          <p class="pane-bottom">排查范围({{ total }})</p>
          <p class="pane-line" />
        </template>
      </px-tab-pane>
      <px-tab-pane name="second">
        <template #label>
          <p class="pane-bottom">排查表({{ total2 }})</p>
        </template>
      </px-tab-pane>
    </px-tabs>
    <checkRadius v-if="activeName === 'first'" @add-div="addDiv" @getTotal="getTotal" />
    <checkTable v-if="activeName === 'second'" @add-div="addDiv" @getTotal="getTotal2" />
  </div>
</template>
<script lang="ts" setup>
defineOptions({
  name: "CommonEquipSetting"
});
import { ref } from "vue";
import checkRadius from "./checkRadius.vue";
import checkTable from "./checkTable.vue";
import { contentquery } from "@/api/scope";
const activeName = ref("first");
const addTag = ref(true);
const total = ref(0);
const total2 = ref(0);
const addDiv = val => {
  console.log(val);
  addTag.value = val;
};
const getTotal = val => {
  total.value = val;
};
const getTotal2 = val => {
  total2.value = val;
};
contentquery({
  orderByColumn: "",
  isAsc: "",
  checkContentId: "",
  contentName: "",
  orderBy: "",
  pageNum: 1,
  pageSize: 20
}).then((response: any) => {
  total2.value = response.total;
});
</script>
<style lang="scss" scoped>
.equipment-tabs {
  background: #fff;
  // padding: 20px 24px;
}

.pane-bottom {
  line-height: 30px;
}

.miandiv {
  width: calc(100% - 48px);
  margin-left: 24px;
}

:deep(.px-tabs__nav) {
  margin: 10px 0 0 24px;
}
</style>
